import Taro, { Component, Config } from '@tarojs/taro'
import { View } from '@tarojs/components'
import './index.scss'
import { getScorePage } from '@/api/userApi'
import { ListEmpty, Loading, LoadMore } from '@/components/index'
import { IntegralRecordList } from '@/market/components'
import { getBrand } from '@/utils/storage'

export default class Index extends Component {
  state: any
  config: Config = {
    backgroundTextStyle: "dark",
    navigationBarTitleText: `${getBrand()}明细`
  }

  constructor() {
    super(...arguments)
    const { params } = this.$router
    if (params.title) {
      Taro.setNavigationBarTitle({title: params.title})
    }
    this.state = {
      params,
      loading: true,
      page: 1,
      limit: 15,
      scoreList: [],
      loadStatus: 'loading',
    }
  }

  componentWillMount() {
    this.getPage()
  }

  //  下拉加载
  onReachBottom() {
    this.getPage()
  }

  //  分页获取优惠券
  getPage() {
    const { page, limit, params, scoreList, loadStatus } = this.state
    const data:any = { page, limit }
    if (loadStatus === 'noMore') {
      return
    }

    if (params.type) {
      data.type = params.type
    }
    getScorePage(data).then((res) => {
      const { list, totalCount } = res.data
      this.setState({
        page: page+1,
        scoreList: page===1 ? list : scoreList.concat(list),
        loadStatus: (page * limit >= totalCount) ? 'noMore' : 'loading',
      }, () => {
        this.setState({
          loading: false
        })
      })
    })
  }

  render() {
    const { loading, scoreList, loadStatus } = this.state
    return (<View className='record-page'>
      {loading && <Loading isCover/>}
      <IntegralRecordList list={scoreList}/>

      {!scoreList.length && loadStatus == 'noMore' ? (<ListEmpty/>) : (<LoadMore status={loadStatus}/>)}
    </View>)
  }
}
